﻿<div class="activity_list_control_wrapper">
    <style type="text/css">
        {styles_placeholder}
    </style>
    <table class="header">
        <tr class="summary">
            <td class="first">
                <h2>
                    Activity Log for {application_name}
                </h2>
            </td>
            <td class="navigation">
                {navigation_controls}
            </td>
            <td class="page_size">
                <span>Page Size: </span>
                <input id="txtAnaliticsPageSize" type="text" value="{page_size}" onchange="javascript:window.reloadReportPage('{page_full_url}', {page_data})" />
            </td>
            <td class="second">
                Total Records: {total_records}
            </td>
        </tr>
    </table>
    <div class="content_wrapper">
        {content_placeholder}
    </div>
    <script type="text/javascript">
        window.reloadReportPage = function (url, data) {
            var pageSize = document.getElementById('txtAnaliticsPageSize').value;
            var correctedUrl = url;
            if (url) {
                correctedUrl = url.replace('page_size_stub', pageSize);
            }
            if (data) {
                data.page_size = pageSize;
            }
            // trigger report control reload global event 
            //Ready: create a generic event
            var evt = document.createEvent("Event");
            evt.reportFullUrl = correctedUrl;
            evt.reportCriteria = data;
            //Aim: initialize it to be the event we want
            evt.initEvent("reload_report_control", true, true); //true for can bubble, true for cancelable
            //FIRE!
            document.dispatchEvent(evt);

            return false;
        }
    </script>
</div>
